<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body name="body" class="content">
    <div id="father">
        <div id="child1">child1</div>
        <div id="child2">child2</div>
        <div id="child3">child3</div>
    </div>

    <script>

        //===== 通过关系查找节点 =====
        //可能会获取到多余的空白文本节点
        /**
         * 1.parentNode
         * 2.childNodes
         * 3.firstChild
         * 4.lastChild
         * 5.previousSibling
         * 6.nextSibling
        */

        //----- parentNode 获取父节点
        let child2 = document.getElementById('child2');
        let fatherNode = child2.parentNode;
        console.log(fatherNode);

        //----- childNodes 获取所有子节点
        console.log(fatherNode.childNodes);

        //----- firstChild 获取第一个子节点
        console.log(fatherNode.firstChild);

        //-----lastChild 获取最后一个子节点
        console.log(fatherNode.lastChild);

        //-----previousSibling 获取前一个兄弟节点
        console.log(child2.previousSibling);

        //----- nextSibling 获取后一个兄弟元素
        console.log(child2.nextSibling);

        //上面的属性有可能会获取到空白文本节点，使用频率不高
        /**
         * 1.parentElement
         * 2.children
         * 3.firstElementChild
         * 4.lastElementChild
         * 5.previousElementSibling
         * 6.nextElementSibling
         * 
        */

        let fatherEle = child2.parentElement;
        console.log(fatherEle);
        console.log(fatherEle.children);


        console.log(1 && 2 && 3);
        console.log(1 && 0 && 3);
        console.log('' && 0 && 3);
        console.log('' && 0 && undefined);

        console.log(1 || 2 || 3);

        console.log(' ' || 0 || 3);
        console.log('' || 0 || 3);


        let arr = [1, 2, 3];
        let [a, , c] = arr;
        console.log(a, c);//  

        // let body=document.getElementsByTagName('body');
        // console.log(body[0]);

        // let body = document.getElementsByName('body');
        // console.log(body[0]);

        // let body=document.getElementsByClassName('content');
        // console.log(body);
        // let body=document.querySelector('body');
        // console.log(body);


    </script>

</body>

</html>